<script>
export default {
  data(){
    return {
      title:"这是底部"
    }
  },
  beforeRouteEnter(to, from, next){
    console.log("footer route enter", to, from);
    // console.log(this);
    next((vm)=>{
      console.log(vm)
      console.log(vm.title)
    })
  },
  beforeRouteUpdate(to, from){
    console.log("footer route update:", to, from)
    console.log(this);
  },
  beforeRouteLeave(to, from){
    console.log("footer route leave:", to, from)
    console.log(this);
  }
}
</script>

<template>
  <div class="footer">
    <h1>这是页面的底部区域</h1>
  </div>
</template>

<style>
.footer{
  text-align:center;
  line-height:50px;
  background:#efefef
}
</style>
